<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title></title>
    <link href="css/mui.min.css" rel="stylesheet"/>
    <link rel="stylesheet" href="css/iconfont.css" />
     <script src="js/mui.min.js"></script>
</head>
<body>
	
	<div class="mui-content">
	    
	</div>
	<nav id="bar" class="mui-bar mui-bar-tab">
	    <a class="mui-tab-item mui-active" href="tab-main.html" >
	        <span class="mui-icon mui-icon-home"></span>
	        <span class="mui-tab-label">首页</span>
	    </a>
	    <a class="mui-tab-item" href="tab-check.html">
	        <span class="mui-icon mui-icon-map"></span>
	        <span class="mui-tab-label">审核管理</span>
	    </a>
	    <a class="mui-tab-item" href="tab-self.html">
	        <span class="mui-icon mui-icon-person"></span>
	        <span class="mui-tab-label">我的</span>
	    </a>
	</nav> 
	 <script>
		mui.init();
	 	//创建子页面
		var subpages = ['tab-main.html','tab-check.html','tab-self.html'];
		var subpage_style = {
		    top: '0px',
		    bottom: '50px',
		    scrollIndicator: "none" ,// 当你的界面的内容足够多的时候，会出现滚动条，这个是隐藏滚动条
		};
	 	mui.plusReady(function() {
	 		//获得当前页面
			var curpage = plus.webview.currentWebview();
			//循环创建子页面
			for(var i=0;i<subpages.length;i++) {
				//预创建界面
				var sub = plus.webview.create(subpages[i],subpages[i],subpage_style);
				if(i > 0) {
					sub.hide();
				}
				
				curpage.append(sub);
			}
	 	});
	 	//当前激活选项卡
	 	var activeTab = subpages[0];
	 	//选项卡点击事件
	 	mui("#bar").on("tap","a",function(e) {
	 		
	 		var targetTab = this.getAttribute("href");
	 		if(targetTab==activeTab) {
	 			return;
	 		}
	 		//显示目标选项卡
	 		plus.webview.show(targetTab);
	 		//隐藏当前选项卡
	 		plus.webview.hide(activeTab);
	 		//更改当前活跃的选项卡
	 		activeTab = targetTab;
	 	});
	 </script>
</body>
</html>